<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

</body>
<script>
  // this  -> 函数内置的关键词  函数在调用时依存的对象
  // (1) 普通函数 (命名函数和匿名函数)   this -> window   严格模式下:undefined
  // (2) 函数在调用时 属于谁 就指向谁   obj.say  btn.onclick  Tom.say
  // (3) 箭头函数没有自己的this => 向外跳一层找父作用域  
  // (4) 构造函数中this 指向 构造函数在执行过程创建的实例化对象

  // 改变this指向的方法?  
  // call   apply   bind  => 所有的函数均可以使用

  // fn.call()  fn.apply()   借鸡生蛋 => 不影响原函数    调用原函数,在本次函数执行过程中改变 
  // fn.bind()               授人以鱼不如授人以渔  =>    生成新函数   新函数的this改变


  // bind(obj,arg1,arg2,...argN)   
  // (1) 根据原函数生成新的函数
  // (2) 新函数执行过程中  强制将this执行bind()方法的第一参数
  // (3) 如果函数需要接收参数  
  //    a. 使用bind方法时  就从第二参数开始  依次传入
  //    b. 使用bind方法时 只规定this指向  调用时传入

  function fn(a, b) {
    console.log(this);
    console.log(a, b);
  }

  /*   var newFn =  fn.bind(document.body,1000,2000);  //提前规定好了 this指向 和 参数
    //    console.log(newFn);
    //    console.log(newFn === fn);

    newFn();
    newFn();
    newFn();
    newFn(); */


  var newFn = fn.bind(document.body);

  newFn(10, 20)
  newFn(100, 200)










</script>

</html>